<template>
  <v-container>
    <v-toolbar flat color="white">
      <v-toolbar-title>故障摄像头</v-toolbar-title>
    </v-toolbar>
    <v-divider></v-divider>
    <v-data-table :headers="headers" :items="fault" class="elevation-1" :rows-per-page-items="[6]">
      <template slot="items" slot-scope="props">
        <td>{{ props.item.serialno }}</td>
        <td class="text-xs-left">{{ props.item.camerano }}</td>
        <td class="text-xs-left">
          <v-icon color="red">·</v-icon>
        </td>
      </template>
    </v-data-table>
  </v-container>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  data() {
    return {
      headers: [
        {
          text: "编号",
          align: "left",
          sortable: false,
          value: "serialno"
        },
        { text: "摄像头编号", value: "camerano" },
        { text: "状态", value: "status", sortable: false }
      ]
    };
  },

  computed: {
    ...mapGetters("camerastatus", ["fault"])
  }
};
</script>
